home *** CD-ROM | disk | FTP | other *** search
/ 207.233.110.77 / 207.233.110.77.tar / 207.233.110.77 / web29 / Tutorial 5 / rounded.css < prev    next >
Cascading Style Sheet File  |  2011-02-28  |  2KB  |  58 lines
  1. /*
  2.    New Perspectives on HTML and XHTML 5th Edition
  3.    Tutorial 5
  4.    Tutorial Case
  5.  
  6.    Style Sheet to create rounded boxes
  7.    Author: Richard Thomson
  8.    Date:   Feb28, 2011
  9.  
  10.    Filename:         rounded.css
  11.    Supporting Files: bottom.png, bottomleft.png, bottomright.png, left.png,
  12.                      right.png, top.png, topleft.png, topright.png
  13.  
  14. */
  15.  
  16. table.roundedBox
  17.         {margin: 5px; border-collapse: collapse}
  18.  
  19. table.roundedBox td
  20.         {padding: 0px}
  21.  
  22. table.roundedBox td.topLeft
  23.         {width: 16px; height: 16px}
  24.  
  25. table.roundedBox td.topRight
  26.         {width: 16px; height: 16px}
  27.  
  28. table.roundedBox td.bottomLeft
  29.         {width: 16px; height: 16px}
  30.  
  31. table.roundedBox td.bottomRight
  32.         {width: 16px; height: 16px}
  33.  
  34. table.roundedBox td.top
  35.         {width: auto; height: 16px}
  36.  
  37. table.roundedBox td.bottom
  38.         {width: auto; height: 16px}
  39.  
  40. table.roundedBox td.left
  41.         {width: 16px; height: auto}
  42.  
  43. table.roundedBox td.right
  44.         {width: 16px; height: auto}
  45.  
  46. .topLeft    {background: url(topLeft.png) no-repeat top left}
  47. .topRight    {background: url(topRight.png) no-repeat top right}
  48. .bottomLeft    {background: url(bottomLeft.png) no-repeat bottom left}
  49. .bottomRight    {background: url(bottomRight.png) no-repeat bottom right}
  50.  
  51. .top        {background: url(top.png) repeat-x top}
  52. .bottom        {background: url(bottom.png) repeat-x bottom}
  53.  
  54. .left        {background: url(left.png) repeat-y left}
  55. .right        {background: url(right.png) repeat-y right}
  56.  
  57. div.roundedBox    {margin: 5px; position: relative}
  58. div.boxContent    {padding: 16px}